<template>
  <el-card>
      <!-- 系统配置 -->
      <bread-crumb slot="header">
        <template slot="title">系统配置</template>
      </bread-crumb>
      <div class="bigBox">
        <el-table :header-cell-style="{ background: '#eee', color: '#606266' }" :data="tableData"  max-height="450" style="width: 100%">
          <el-table-column prop="licence" label="名称" width="410%"></el-table-column>
          <el-table-column prop="Institutional" label="电话" width="340%"></el-table-column>
          <el-table-column prop=" " label=" " width="280%"></el-table-column>
          <el-table-column label="操作" width="230%">
                  <!-- <template>
                    <el-button
                      @click="exportBounced = true"
                      type="text"
                      size="small">
                      修改账号
                    </el-button>
                    <el-button
                      @click="exportBouncedsssss = true"
                      type="text"
                      size="small">
                      重置密码
                    </el-button>
                  </template> -->
          </el-table-column>
        </el-table>
        <!-- 分页 -->
          <el-row
            type="flex"
            align="middle"
            justify="center"
            style="margin-top: 20px"
          >
            <el-col :span="5">
              <el-pagination
                background
                layout="total, prev, pager, next, sizes"
                :total="page.total"
                :page-sizes="[7, 10, 20, 50, 100]"
                :page-size="page.pageSize"
                @current-change="changePage"
                @size-change="handleSizeChange"
                :current-page.sync="page.currentPage"
              ></el-pagination>
            </el-col>
          </el-row>
      </div>
  </el-card>
</template>

<script>
export default {
  data () {
    return {
      rules: {
        account: [
          { required: true, message: '请输入密码', trigger: 'blur' },
          { min: 8, message: '密码必须是数字和字母组合长度不能小于8', trigger: 'change' }
        ]
      },
      formLabelAlign: {
        account: ''
      },
      exportBounced: false,
      exportBouncedsssss: false,
      page: {
        // 分页数据
        total: 1000, // 总条数
        currentPage: 1, // 默认的页码 是第一个页  决定了当前页码是第几页
        pageSize: 9 // page-size的默认值是10条
      },
      tableData: [
        {
          licence: '杭州市教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        },
        {
          licence: '上城区教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        },
        {
          licence: '下城区教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        },
        {
          licence: '江干区教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        },
        {
          licence: '拱墅区教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        },
        {
          licence: '西湖区教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        },
        {
          licence: '滨江区教育局',
          Institutional: '133010670004059', // 1
          Organizers: '暂无' // 4
        }
      ]
    }
  },
  methods: {
    // 当选择项发生变化时会触发该事件
    handleSelectionChange (val) {
      console.log('我选择了')
      console.log(val)
      this.multipleSelection = val
    }
  }
}
</script>

<style lang="less" scoped>

  .bigBox {
    padding: 20px;
  }

</style>
